{% load mytags %}
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<style type="text/css">
    .BaseForSelectFields { 
        width: 100%;  
    }
    
    .EmptyBlockSelectFields { 
        width: 10px; 
        float: left;  
    }
    
    .ActivityProjectCode { 
        width: 150px; 
        float: left; 
    }
    
    .ActivitySelectFields { 
        width: 170px; 
        float: left; 
    } 
    
    .ProjectSelectFields { 
        width: 200px;  
        float: left;
    } 


    .BaseForTables { 
        width: 100%;  
        float: left; 
    }

    .EmptyBlockForTables { 
        width: 10px; 
        float: left;  
    }
    
    .ActivityTable { 
        width: 150px; 
        float: left; 
    }   

    .ProjectTable { 
        width: 150px;  
        float: left;
    } 
    
    .TimeTable {  
        float: right;
    } 
    
    
    .Table {
        padding: 0;
        margin: 0;
    }

    .TableCell {
        width: 100%;
        border: solid 1px black;
        background: #FFFFFF;
        cursor: pointer;
    }
    
    .TableSelectCell {
        width: 100%;
        border: solid 1px black;
        color: #FFFFFF;
        background: #10A100;
        cursor: pointer;
    }
    
    .TableTitle {
        width: 100%;
        border: solid 1px black;
        background: #FDFFCF;
    }
</style>
<title> UserTS </title>
</head>
<body>
    <SCRIPT LANGUAGE='JavaScript'>
        
        function selectTableLine(code) {
		    if(this.last_line)
				this.last_line.bgColor = '#FFFFFF'
            if(this.select_line = document.getElementById(code)){
			    this.select_line.bgColor = '#CCCCCC'
				this.last_line = this.select_line
		    }
        }
		
		function TimeFormTable() {
		    this.last_line
			this.select_line
			this.selectTableLine = selectTableLine
		}
		
		
		function fillingFormDate(id_field, filling_value) {
            document.getElementById(id_field).value = filling_value
        }
        
        
        function insertDivText(div) {
            div.innerHTML = this.text
        }
        
        function addingText(text_one, text_two) {
            this.text = text_one + text_two
        }
        
        function TextObject() {
	        this.text = ' '
	        this.insertDivText = insertDivText
	        this.addingText = addingText
        }
        
        
        function rememberFieldData(id_field, name_field){
            this.id_field = id_field
            this.name_field = name_field
        }
        
        function changeCellStyle(event) {
	        event = event || window.event
	        var clicked_elem = event.target || event.srcElement
	        
	        if(this.is_clicked==0) {
	            if(clicked_elem.className=="TableCell")
	                clicked_elem.className = "TableSelectCell"
	            this.is_clicked = 1
	        }
	        else {
	            this.last_clicked.className = "TableCell"
	            if(clicked_elem.className=="TableCell")
	                clicked_elem.className = "TableSelectCell"
	        }
	        this.last_clicked = clicked_elem
        }
        
        function SelectCell(last_clicked) {
	        this.is_clicked = 0
	        this.id_field = -1
	        this.name_field = '...'
	        this.last_clicked = last_clicked
	        this.rememberFieldData = rememberFieldData
	        this.changeCellStyle = changeCellStyle
        }
        
        function NewStringInTable(num) {            
            counter++
            if (counter == 5) {
                counter = 0
                j++
                document.write('<tr>')
            }
        }
        
        function WriteActivityProject(counter) {
            if (counter == 0) {
                document.write('<td>'+list[j]+'</td>')
            }
        }
        
        var activity_select
        var project_select
        
        activity_select = new SelectCell(null)
        project_select = new SelectCell(null)
        
        var div_text
        var div_code_text
        
        div_text = new TextObject()
        div_code_text = new TextObject()
		
		var time_table_line
		
		time_table_line = new TimeFormTable()
		
		var counter = 0
		var j = 0
        
    </SCRIPT>
    
    Timesheet
    <A href=''>user</A>
    <A href=''>PM</A>
    <div class="BaseForSelectFields">
        <div class="EmptyBlockSelectFields">
        </div>
        <div id='activity_project_code_div' name='activity_project_code_div' class="ActivityProjectCode">
            code: ->...
        </div>
        <div id='activity_select_div' name='activity_select_div' class="ActivitySelectFields">
            activity: ->...
        </div>
        <div id='project_select_div' name='project_select_div' class="ProjectSelectFields">
            project: >...
        </div>
    </div>
    <p> </p>
    <div class="BaseForTables">
        <div class="EmptyBlockForTables">
        </div>
        <div class="ActivityTable">
            <div class="Table">
                <table>
                    <td>
                        <tr>
                            <div class="TableTitle">
                                Activitys:
                            </div>
                        </tr>
                        {% for x in activity %}
                            <tr>
                                <div onclick="activity_select.changeCellStyle(arguments[0]), 
                                              activity_select.rememberFieldData('{{ x.id }}', '{{ x.type_activity }}'), 
                                              div_code_text.addingText('code: ->', activity_select.id_field),
                                              div_code_text.addingText(div_code_text.text, ' : '),
                                              div_code_text.addingText(div_code_text.text, project_select.id_field),
                                              div_code_text.insertDivText(activity_project_code_div),
                                              div_text.addingText('activity: ->', activity_select.name_field), 
                                              div_text.insertDivText(activity_select_div), 
											  time_table_line.selectTableLine(div_code_text.text)" 
                                              class="TableCell">                                    {{ x.type_activity }}
                                </div>
                            </tr>                        {% endfor %}
                    </td>
                </table>
            </div>
        </div>
        <div class="ProjectTable">
            <div class="Table">
                <table>
                    <td>
                        <tr>
                            <div class="TableTitle">
                                Projects:
                            </div>
                        </tr>
                        {% for x in project %}
                            <tr>
                                <div onclick="project_select.changeCellStyle(arguments[0]), 
                                              project_select.rememberFieldData('{{ x.id }}', '{{ x.type_project }}'),
                                              div_code_text.addingText('code: ->', activity_select.id_field),
                                              div_code_text.addingText(div_code_text.text, ' : '),
                                              div_code_text.addingText(div_code_text.text, project_select.id_field),
                                              div_code_text.insertDivText(activity_project_code_div), 
                                              div_text.addingText('project: ->', project_select.name_field), 
                                              div_text.insertDivText(project_select_div), 
											  time_table_line.selectTableLine(div_code_text.text)" 
                                              class="TableCell">                                    {{ x.type_project }}
                                </div>
                            </tr>                        {% endfor %}
                    </td>
                </table>
            </div>
        </div>
        <div class="TimeTable">
            <form name="time_form" id="time_form" action="" method="post">
                <table>
                    <tr>
                    <td>
                        {% for day in week %}
                            <td align="center"> {{ day }} </td>
                        {% endfor %}
                    </tr>
                    <tr>
                    <script language=javascript>
                        var i = 0
                        var list = new Array()
                        {% for ap in activity_project %}
                            list[i] = "{{ ap.activity }} {{ ap.project }}"
                            i++
                        {% endfor %}
                    </script>
                     {% for form in forms %}
                     <script language=javascript>
                         WriteActivityProject(counter)
                     </script>
                    <td>{{ form }}</td> 
                     <script language=javascript>
                         NewStringInTable(5)
                     </script>
                     {% endfor %}
                    </tr> 
                </table>
                <input name="user" id="id_user" type="hidden" value="1">
                <input name="activity" id="id_activity" type="hidden">
                <input name="project" id="id_project" type="hidden">
                <td> <input onclick="fillingFormDate('id_activity', activity_select.id_field), 
                                    fillingFormDate('id_project', project_select.id_field)"
                                    type="submit" value="Ok"> </td>
            </form>
            <div align=right>
            <form action="" method=get>
            <table>
            <tr>
                <td><input type=submit value="Total"></td>
                {% if total %}
                    {% for tot in total %}
                        <td><input name="total" size=3 ID="Text1" value={{ tot }}></td>
                    {% endfor %}
                {% else %}
                    {% for day in week %}
                        <td><input name="total" size=3></td>
                    {% endfor %}
                {% endif %}
            </tr>
            </table>
            </form>
            </div>
        </div>
    </div>
    <p> Are you wish to quit? --> <a href="{% url auth_logout %}">QUIT</a>.</p>
        <input type=submit value="Complete" id="email" size=7>
</body>
</html>
